<template>
    <div class="async">
        <h3>Promise、setTimeout与async</h3>
    </div>
</template>
<script setup lang="ts">
// import './test'
// import './test2'
// import './test3'
import all from './all'
const p1 = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve({ resule: 'access', code: 200, value: 'p1' })
        }, 1000)
    })
}
const p2 = () => {
    return new Promise((_, reject) => {
        setTimeout(() => {
            reject({ resule: 'fail', code: 400, value: 'p2' })
        }, 400)
    })
}
const a1 = async () => {
    await setTimeout(() => {}, 450)
    return { result: 'success', code: 200, value: 'a1' }
}
const a2 = async () => {
    await setTimeout(() => {}, 300)
    throw new Error('fail a2')
}
const funSuccessObj = {
    p1,
    a1,
}
const funFailObj = {
    p2,
    a2,
}
const funObj = {
    p1,
    p2,
    a1,
    a2,
}
const testPromiseAll = function () {
    // all 如果都为 resolve 则返回 resolve 数组，若有返回 reject 则 catch 返回第一个 reject
    Promise.all(Object.values(funObj).map((item) => item()))
        .then((res) => {
            console.log('promise all has error then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise all has error catch:'.padEnd(20, ' '), err)
        })
    Promise.all(Object.values(funSuccessObj).map((item) => item()))
        .then((res) => {
            console.log('promise all successs then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise all successs catch:'.padEnd(20, ' '), err)
        })
}
// promise all has error catch: Error: fail a2
// promise all successs then: (2) [{…}, {…}]

const testCurstomAll = function () {
    // all 如果都为 resolve 则返回 resolve 数组，若有返回 reject 则 catch 返回第一个 reject
    all(Object.values(funObj).map((item) => item()))
        .then((res) => {
            console.log('promise all has error then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise all has error catch:'.padEnd(20, ' '), err)
        })
    all(Object.values(funSuccessObj).map((item) => item()))
        .then((res) => {
            console.log('promise all successs then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise all successs catch:'.padEnd(20, ' '), err)
        })
}

const testPromiseAllSettled = function () {
    // allSettled 返回 promise 结果数组 包含三个 属性 status： 状态fulfilled|rejected, value?: 状态为 fulfilled 的值；reason?： 状态为rejected的值
    Promise.allSettled(Object.values(funObj).map((item) => item()))
        .then((res) => {
            console.log('promise allSettled then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise allSettled catch:'.padEnd(20, ' '), err)
        })
    Promise.allSettled(Object.values(funFailObj).map((item) => item()))
        .then((res) => {
            console.log('promise allSettled fails then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise allSettled fails catch:'.padEnd(20, ' '), err)
        })
}
// promise allSettled fails then: (2) [{…}, {…}]
// promise allSettled then: (4) [{…}, {…}, {…}, {…}]

const testPromiseAny = function () {
    // any 返回第一个 resolve ，如果所有的结果都为 reject 则返回被catch捕获返回AggregateError: All promises were rejected
    Promise.any(Object.values(funObj).map((item) => item()))
        .then((res) => {
            console.log('promise any then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise any catch:'.padEnd(20, ' '), err)
        })
    Promise.any(Object.values(funFailObj).map((item) => item()))
        .then((res) => {
            console.log('promise any fails then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise any fails catch:'.padEnd(20, ' '), err)
        })
}
// promise any then:    {result: 'success', code: 200, value: 'a1'}
// promise any fails catch: AggregateError: All promises were rejected

const testPromiseRace = function () {
    // race 返回第一个 resolve ，如果所有的结果都为 reject 则返回被catch捕获返回AggregateError: All promises were rejected
    Promise.race(Object.values(funObj).map((item) => item()))
        .then((res) => {
            console.log('promise race then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise race catch:'.padEnd(20, ' '), err)
        })
    Promise.race(Object.values(funFailObj).map((item) => item()))
        .then((res) => {
            console.log('promise race fails then:'.padEnd(20, ' '), res)
        })
        .catch((err) => {
            console.log('promise race fails catch:'.padEnd(20, ' '), err)
        })
}
// promise race then:   {result: 'success', code: 200, value: 'a1'}
// promise race fails catch: Error: fail a2

testPromiseAll()
testCurstomAll()
testPromiseAllSettled()
testPromiseAny()
testPromiseRace()
</script>
<style lang="scss" scoped>

</style>
